<!DOCTYPE html>
<html>

<head>
    <meta charset="UTF-8" />
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>2.sessionStorage</title>
</head>

<body>
    <h1>sessionStorage</h1>
    <button onclick="savePerson()">向sessionStorage中存入一个人</button><br /><br />
    <button onclick="getPerson()">从sessionStorage中通过key去读取对应的value</button><br /><br />
    <button onclick="deletePerson()">从sessionStorage中通过key去删除一组记录</button><br /><br />
    <button onclick="deleteAll()">清空sessionStorage</button>
    <script type="text/javascript">
        let person = {
            name: '圆圆的琪琪',
            age: 25,
            gender: '女'
        }
        //存
        function savePerson() {
            sessionStorage.setItem('person', JSON.stringify(person))
        }
        //读取
        function getPerson() {
            const result = sessionStorage.getItem('person')
            console.log(JSON.parse(result))
        }
        //从sessionStrage中删除对应信息
        function deletePerson() {
            sessionStorage.removeItem('person')
        }
        //删除所有
        function deleteAll() {
            sessionStorage.clear()
        }
    </script>
</body>

</html>